<template>
  <div>
    <ZgPage
      ref="page"
      title="用户管理"
      addBtnName="新增用户"
      :scrollX="2000"
      :addOpt="{title:'新增用户',width:'50%'}"
      :updateOpt="{title:'修改用户',width:'50%'}"
      @search="onSearch"
      @del="onDel"
      @add="onAdd"
      @update="onUpdate"
      @batch="onBatch"
    >
      <template slot="columns">
        <a-table-column :width="80" title="头像">
          <template slot-scope="text,record">
            <div class="flx-c"><ZgImgHolder isHead :src="record.head"></ZgImgHolder></div>
          </template>
        </a-table-column>
        <a-table-column :width="120" dataIndex="username" title="用户名"></a-table-column>
        <a-table-column :width="120" dataIndex="name" title="姓名"></a-table-column>
        <a-table-column :width="100" dataIndex="sex" title="性别">
          <template slot-scope="text,record">
            <ZgDicHolder parentCode="sex" :code="record.sex"></ZgDicHolder>
          </template>
        </a-table-column>
        <a-table-column :width="140" dataIndex="phone" title="手机号"></a-table-column>
        <a-table-column :width="200" dataIndex="idCard" title="身份证"></a-table-column>
        <a-table-column :width="200" dataIndex="email" title="邮箱"></a-table-column>
        <a-table-column :width="140" dataIndex="eduLevel" title="学历">
          <template slot-scope="text,record">
            <ZgDicHolder parentCode="eduLevel" :code="record.eduLevel"></ZgDicHolder>
          </template>
        </a-table-column>
        <a-table-column :width="100" title="状态">
          <template slot-scope="text,record">
            <a-tag v-if="record.isOpen" color="green">启用</a-tag>
            <a-tag v-else>禁用</a-tag>
          </template>
        </a-table-column>
        <a-table-column dataIndex="lastLoginTime" title="最后登录时间"></a-table-column>
      </template>
      <template slot="add">
        <Add ref="add"></Add>
      </template>
      <template slot="update" slot-scope="scope">
        <Update ref="update" :jsonStr="scope.jsonStr"></Update>
      </template>
      <template slot="batch" slot-scope="scope">
        <Batch ref="batch" :ids="scope.ids"></Batch>
      </template>
    </ZgPage>
  </div>
</template>
<script>
import Add from './Add'
import Update from './Update'
import Batch from './Batch'
export default {
  components: {
    Add, Update, Batch
  },
  data () {
    return {
    }
  },
  methods: {
    onSearch (param) {
      this.$http.get('/zg-system/user/page', param, data => {
        this.$refs.page.endSearch(
          {
            total: parseInt(data.total),
            list: data.records.map(t => {
              t.key = t.id
              return t
            })
          }
        )
      })
    },
    onDel (ids) {
      this.$http.post('/zg-system/user/del', ids, () => {
        this.$refs.page.search()
      })
    },
    onAdd () {
      const result = this.$refs.add.save()
      if (!result.isOk) {
        this.$error({ title: result.msg })
        return
      }
      this.$http.post('/zg-system/user/add', result.data, () => {
        this.$refs.page.hideAdd()
        this.$refs.page.search()
      })
    },
    onUpdate () {
      const result = this.$refs.update.save()
      if (!result.isOk) {
        this.$error({ title: result.msg })
        return
      }
      this.$http.post('/zg-system/user/update', result.data, () => {
        this.$refs.page.hideUpdate()
        this.$refs.page.search()
      })
    },
    onBatch () {
      const result = this.$refs.batch.save()
      if (!result.isOk) {
        this.$error({ title: result.msg })
        return
      }
      this.$http.post('/zg-system/user/batch', result.data, () => {
        this.$refs.page.hideBatch()
        this.$refs.page.search()
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
